<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<title>Mamba UI | Free HTML components and templates built with Tailwind CSS</title>
		<base href="/" />
		<meta
			name="description"
			content="Mamba UI is an UI kit with free components and templates styled with Tailwind CSS"
		/>
		<meta http-equiv="x-ua-compatible" content="ie=edge" />
		<meta http-equiv="Content-Type" content="text/html" />
		<meta name="application-name" content="Mamba UI" />
		<meta name="twitter:dnt" content="on" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="mobile-web-app-capable" content="yes" />
		<meta name="apple-mobile-web-app-title" content="Mamba UI" />
		<meta name="application-name" content="Mamba UI" />
		<meta name="msapplication-TileColor" content="#6d28d9" />
		<meta name="theme-color" content="#6d28d9" />
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<meta property="og:title" content="Mamba UI" />
		<meta
			property="og:description"
			content="Free UI components and templates based on Tailwind CSS"
		/>
		<meta property="og:image" content="https://mambaui.com/assets/images/twitter_card2.png" />
		<meta property="og:url" content="https://mambaui.com" />
		<meta name="twitter:card" content="summary_large_image" />
		<meta property="twitter:title" content="Mamba UI" />
		<meta
			property="twitter:description"
			content="Free UI components and templates based on Tailwind CSS. Just copy-paste HTML, JSX or Vue into your project."
		/>
		<meta name="twitter:site" content="@mamba_ui" />
		<meta name="twitter:creator" content="@mamba_ui" />
		<meta
			property="twitter:image"
			content="https://mambaui.com/assets/images/twitter_card2.png"
		/>
		<meta
			name="twitter:image:alt"
			content="Free UI components and templates based on Tailwind CSS"
		/>
		<link rel="icon" type="image/x-icon" href="./favicon.ico" />
		<link
			rel="apple-touch-icon"
			type="image/png"
			sizes="180x180"
			href="./apple-touch-icon.png"
		/>
		<link rel="icon" type="image/png" sizes="32x32" href="./favicon-32x32.png" />
		<link rel="icon" type="image/png" sizes="16x16" href="./favicon-16x16.png" />
		<link rel="manifest" href="./site.webmanifest" />
		<link rel="mask-icon" href="./safari-pinned-tab.svg" color="#6d28d9" />
		<script
			async
			defer
			data-domain="mambaui.com"
			src="https://analytics.mambaui.com/js/plausible.outbound-links.js"
		></script>
		<style type="text/css">
			body,
			html {
				height: 100%;
				background-color: #1f2937;
			}

			.icon {
				height: 50px;
				width: 50px;
			}

			.app-loading {
				position: relative;
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				height: 100%;
			}

			.app-loading .spinner {
				height: 200px;
				width: 200px;
				animation: rotate 2s linear infinite;
				transform-origin: center center;
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				right: 0;
				margin: auto;
			}

			.app-loading .spinner .path {
				stroke-dasharray: 1, 200;
				stroke-dashoffset: 0;
				animation: dash 1.5s ease-in-out infinite;
				stroke-linecap: round;
				stroke: #ddd;
			}

			@keyframes rotate {
				100% {
					transform: rotate(360deg);
				}
			}

			@keyframes dash {
				0% {
					stroke-dasharray: 1, 200;
					stroke-dashoffset: 0;
				}

				50% {
					stroke-dasharray: 89, 200;
					stroke-dashoffset: -35px;
				}

				100% {
					stroke-dasharray: 89, 200;
					stroke-dashoffset: -124px;
				}
			}
		</style>
	</head>

	<body>
		<app-root>
			<div class="app-loading">
				<img src="favicon.ico" alt="Loading icon" class="icon" />
				<svg class="spinner" viewBox="25 25 50 50">
					<circle
						class="path"
						cx="50"
						cy="50"
						r="20"
						fill="none"
						stroke-width="2"
						stroke-miterlimit="10"
					/>
				</svg>
			</div>
		</app-root>
		<noscript>Please enable JavaScript to continue using this application.</noscript>
	</body>
</html>
